<template>
	<view class="mine">
		<view class="userInfo">
			<image v-if="identity == 0" class="" src="@/static/image/salesman.png"
				style="width: 200rpx;height: 200rpx;" />
			<image v-if="identity == 1" class="" src="@/static/image/lovespecialist.png"
				style="width: 200rpx;height: 200rpx;" />
			<view class="" style="margin-left: 24rpx;">
				<view v-if="identity == 0" class="">
					业务经理
				</view>
				<view v-if="identity == 1" class="">
					爱心专员
				</view>
				<view class="" style="margin-top: 14rpx;">
					{{userinfo.name}}
				</view>
			</view>

		</view>

		<view class="btnBox">
			<view v-if="identity == 0" class="btn" @click="handleAnnouncement">
				发布公告
			</view>
			<view v-if="identity == 1" class="btn" @click="handleannouncwmentsList">
				活动公告列表
			</view>
			<view class="btn" @click="handleAboutus">
				关于平台
			</view>
		</view>

		<view class="qInfo">
			<view class="title">
				签到详情
			</view>
			<view class="infoitem">
				<view class="lable">
					姓名
				</view>
				<view class="">
					{{userinfo.name}}
				</view>
			</view>
			<view class="infoitem">
				<view class="lable">
					职务
				</view>
				<view v-if="identity == 0" class="">
					业务经理
				</view>
				<view v-if="identity == 1" class="">
					爱心专员
				</view>
			</view>
			<view class="infoitem">
				<view class="lable">
					电话
				</view>
				<view class="">
					{{userinfo.account}}
				</view>
			</view>
			<view v-if="userinfo.address != null" class="infoitem">
				<view class="lable">
					地址
				</view>
				<view class="">
					{{userinfo.address == null ? "" : userinfo.address}}
				</view>
			</view>

		</view>
		
		<view v-if="identity == 0" class="myUsers">
			<view class="title">
				我的团队
			</view>
			<view class="item">
				今日签到：{{userinfo.today_manager}}
			</view>
			<view class="item">
				累计签到：{{userinfo.total_manager}}
			</view>

		</view>

		<!-- <view class="myUser">
			<view class="title">
				我的用户
			</view>
			<view class="bottom">

				<view class="useritem">
					<view class="top">
						163人
					</view>
					<view class="">
						用户列表
					</view>
				</view>
				<view class="useritem">
					<view class="top">
						¥1650
					</view>
					<view class="">
						订购金额
					</view>
				</view>
				<view class="useritem">
					<view class="top">
						¥359
					</view>
					<view class="">
						报单明细
					</view>
				</view>
			</view>

		</view> -->

		<view class="concat">
			<view class="concatitem" @click="handleCallMoilie">
				<image class="" src="@/static/image/phone.png" style="width: 72rpx;height: 72rpx;" />
				<view class="" style="margin-left: 18rpx;">
					联系经理
				</view>
			</view>
			<view class="concatitem" style="position: relative;">
				<image class="" src="@/static/image/krfu.png" style="width: 72rpx;height: 72rpx;" />
				<view class="" style="margin-left: 18rpx;">
					联系经理
					<button type="" class="floatIcon" open-type="contact"></button>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		userInfo,
		myTeam,
		salerMobile
	} from "@/api/api.js"
	export default {
		data() {
			return {
				identity: 0,
				userinfo: {},
				moblie: null,

			}
		},
		onLoad() {
			if (uni.getStorageSync("identity") == 0) {
				this.title = "业务经理"
			} else if (uni.getStorageSync("identity") == 1) {
				this.title = "爱心专员"
			} else {
				this.title = "司机"
			}
			this.identity = uni.getStorageSync("identity")
			this.getUserInfo()
			// this.getmyTeam()
			this.getsalerMobile()
		},
		methods: {
			async getUserInfo() {
				let res = await userInfo()
				console.log("用户信息", res)
				if (res.code == 1000) {
					this.userinfo = res.data
				}
			},
			async getmyTeam() {
				let res = await myTeam()
				console.log("我的团队", res)
			},
			async getsalerMobile() {
				let res = await salerMobile()
				// console.log("联系经理",res)
				this.moblie = res.data
				// console.log("this.mobile",this.mobile)
			},
			handleCallMoilie() {
				uni.makePhoneCall({
					phoneNumber: this.moblie,
					success() {
						console.log("拨打成功")
					},
					fail() {
						console.log("取消")
					},
				});
			},
			handleAnnouncement() {
				uni.navigateTo({
					url: "./announcement"
				})
			},
			handleannouncwmentsList() {
				uni.navigateTo({
					url: "./announcementsList"
				})
			},
			handleAboutus() {
				uni.navigateTo({
					url: "./aboutUs"
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.floatIcon {
		width: 334rpx;
		height: 110rpx !important;
		background-color: transparent;
		height: 80rpx;
		position: absolute;
		top: 0rpx;
		left: 0;
		border: none !important;
		outline: none !important;
		// background-color: pink;
	}

	.floatIcon::after {
		border: none;
	}

	.mine {
		.userInfo {
			margin-top: 20rpx;
			padding: 0 30rpx;
			display: flex;
			align-items: center;
			font-size: 34rpx;
			font-family: PingFang SC-Semibold, PingFang SC;
			font-weight: 600;
			color: #000000;
			line-height: 40rpx;
		}

		.btnBox {
			margin-top: 10rpx;

			.btn {
				margin: 16rpx auto;
				width: 686rpx;
				height: 82rpx;
				background: linear-gradient(180deg, #FE5C5C 0%, rgba(255, 78, 78, 0.67) 100%);
				border-radius: 16rpx 16rpx 16rpx 16rpx;
				font-size: 48rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #FFFFFF;
				line-height: 82rpx;
				text-align: center;
			}
		}

		.qInfo {
			width: 686rpx;
			// height: 410rpx;
			background: #F2F2F2;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin: 20rpx auto;
			padding: 20rpx;
			box-sizing: border-box;

			.title {
				width: 100%;
				font-size: 40rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #000000;
				line-height: 47rpx;
				text-align: center;
			}

			.infoitem {
				display: flex;
				font-size: 32rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #000000;
				line-height: 38rpx;
				margin-top: 30rpx;

				.lable {
					width: 100rpx;
				}
			}
		}

		.myUsers {
			width: 686rpx;
			background: #F2F2F2;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin: 20rpx auto;
			padding: 20rpx;
			box-sizing: border-box;
			.title{
				width: 100%;
				text-align: center;
				font-size: 48rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #000000;
				line-height: 56rpx;
			}
			.item{
				font-size: 32rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #000000;
				line-height: 76rpx;
			}
		}

		.myUser {
			width: 686rpx;
			height: 278rpx;
			background: #F2F2F2;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin: 20rpx auto;
			padding: 20rpx;
			box-sizing: border-box;

			.title {
				width: 100%;
				text-align: center;
				font-size: 48rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #000000;
				line-height: 56rpx;
			}

			.bottom {
				display: flex;
				justify-content: space-between;
				margin-top: 20rpx;

				.useritem {
					display: flex;
					flex-direction: column;
					align-items: center;
					font-size: 32rpx;
					font-family: PingFang SC-Semibold, PingFang SC;
					font-weight: 600;
					color: #000000;
					line-height: 38rpx;

					.top {
						width: 118rpx;
						height: 76rpx;
						background: #D9D9D9;
						border-radius: 16rpx 16rpx 16rpx 16rpx;
						font-size: 32rpx;
						font-family: PingFang SC-Semibold, PingFang SC;
						font-weight: 600;
						color: #000000;
						line-height: 76rpx;
						text-align: center;
						margin-bottom: 20rpx;
					}
				}
			}
		}


		.concat {
			padding: 30rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;

			.concatitem {
				display: flex;
				align-items: center;
				width: 334rpx;
				height: 110rpx;
				background: #F17171;
				border-radius: 16rpx 16rpx 16rpx 16rpx;
				padding: 18rpx 42rpx;
				box-sizing: border-box;
				font-size: 40rpx;
				font-family: PingFang SC-Semibold, PingFang SC;
				font-weight: 600;
				color: #FFFFFF;
				line-height: 47rpx;
			}
		}
	}
</style>